import React, { Component } from 'react'

export default class Footer extends Component {
    handleCheckAll = (e) =>{
        this.props.listAllCheck(e.target.checked)
    }
    // 清除所有已完成得
    handleAllDone = () =>{
        this.props.delelteAllDone()
    }
    render() {
        const {todos} = this.props
        // 已完成个数
        let doneCount = todos.reduce((old,now)=>{return old + (now.done ? 1 : 0)},0)
        // 总个数
        console.log(doneCount);
        return (
            <div>
                全选<input type="checkbox" onChange={this.handleCheckAll} checked={doneCount === todos.length && todos.length !== 0 ?  true : false}/>
                <button onClick={this.handleAllDone}>清除已完成任务</button>
                <span>已完成{doneCount}</span>
            </div>
        )
    }
}
